$(function () {
    $("#jqGrid").jqGrid({
        url: baseURL + 'book/content/list',
        datatype: "json",
        colModel: [			
			{ label: 'ISBN', name: 'isbnNo',index:"isbn_no",width:120 },
			/*{ label: '书柜编码', name: 'shelfCode',index:"shelf_code",width:110,align:'center' },*/
			{ label: '书籍名称', name: 'bookName',index:"book_name" ,width:240,align:'center' },
			{ label: '作者', name: 'author',index:"author",width:200,align:'center' },
			{ label: '出版社', name: 'press',index:"press",width:180,align:'center' },
			{ label: '出版时间', name: 'publicationDate',index:"publication_date" ,width:170,align:'center' },
			{ label: '主题', name: 'topicalName',index:"book_subject",width:180,align:'center' },
			{ label: '书籍标签', name: 'tagName',index:"book_tag",width:180,align:'center' },
			{ label: '阅读年龄', name: 'readAge',index:"min_age" ,width:90,align:'center',sortable:false },
			/*{ label: '阅读最大年龄', name: 'maxAge',index:"max_age" ,width:90,align:'center' },*/
			/*{ label: '状态', name: 'borrowedStatus',index:"borrowed_status",width:60,align:'center' },*/
			{ label: '操作', name: 'id', width: 150 ,formatter:function(cellvalue, options, rowObject){  
				return "<a onclick=\"updateSubjectHtml("+rowObject.id+",\'"+rowObject.topicalName+"\',"+rowObject.description+")\">编辑</a>";
			},sortable:false,align:'center'}
        ],
		viewrecords: true,
        height: 385,
        rowNum: 10,
		rowList : [10,30,50,100,200],
        rownumbers: true, 
        rownumWidth: 25, 
        autowidth:true,
        autoScroll:true,
        shrinkToFit:false,
        multiselect: true,
        pager: "#jqGridPager",
        jsonReader : {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        prmNames : {
            page:"page", 
            rows:"limit", 
            order: "order"
        }
        
    });
    /*创建jqGrid的操作按钮容器*/
    /*可以控制界面上增删改查的按钮是否显示*/
    //jQuery("#jqGrid").jqGrid('navGrid', '#jqGridPager', {edit : true,add : true,del : true});
    //表格宽度自适应
    $(function(){
       $(window).resize(function(){
          $("#jqGrid").setGridWidth($(window).width());
       });
    });
});


var vm = new Vue({
	el:'#rrapp',
	data:{
		q:{
			userName: null,
			mobileNo: null,
			statusCash: null
		},
		showList: true,
		title: null
	},
	methods: {
		query: function () {
			vm.reload();
		},
		reload: function (event) {
			//eg
			vm.showList = true;
			var page = $("#jqGrid").jqGrid('getGridParam','page');
			$("#jqGrid").jqGrid('setGridParam', {
				postData : {
					'mobileNo' : vm.q.mobileNo,
					'userName' : vm.q.userName,
					'cashStatus' : vm.q.statusCash
				},
				page : page
			}).trigger("reloadGrid");
		}
	}
});